<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
	<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
	<title>常用出行人</title>
	<link rel="stylesheet" href="../../../css/aui.css" />
	<link rel="stylesheet" href="../../../css/my/sort.css" />
	<link rel="stylesheet" href="../../../css/iconfont/iconfont.css" />
	<link rel="stylesheet" href="../../../css/my/frequenter/index.css" />
</head>
<body style="cursor: pointer;">
<div class="aui-content content-padded" style="position:fixed;width:100%;background:#f7f7f7;z-index:999;">
	<div class="search">
		<i class="aui-iconfont aui-icon-search" style="line-height:2.2rem;"></i>
		<input class="" onchange="change(this)" type="text" placeholder="搜索出行人">
	</div>

</div>
<div style="height:2.5rem;"></div>

<div id="letter" ></div>
<div class="sort_box">

</div>
<div class="initials">
	<ul>
		 <!--<li><img src="../../../image/068.png"></li> -->
	</ul>
</div>

</body>
</html>
<script type="text/javascript" src="../../../script/aui/api.js"></script>
<script type="text/javascript" src="../../../script/aui/aui-dialog.js"></script>
<script type="text/javascript" src="../../../script/extend/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="../../../script/extend/jquery.charfirst.pinyin.js"></script>
<script type="text/javascript" src="../../../script/extend/sort.js"></script>
<script type="text/javascript" src="../../../script/common.js"></script>
<script type="text/javascript" src="../../../script/config.js"></script>

<script type="text/javascript">
    apiready = function() {
        api.parseTapmode();
        get_travelers_list('');
				//接收监听证件类型和证件号码
        api.addEventListener({
            name: 'travelList'
        }, function(ret, err) {
            if (ret.value.submit == 1) {
							get_travelers_list('');
						}
        });
    };
	//向左滑动删除
	window.addEventListener('load',function(){
		var initX;
		var moveX;
		var X = 0;
		var objX = 0;
		window.addEventListener('touchstart',function(event){
			// event.preventDefault();
			var obj = event.target.parentNode;
			if(obj.className == "sort_list"){
				initX = event.targetTouches[0].pageX;
				objX =(obj.style.WebkitTransform.replace(/translateX\(/g,"").replace(/px\)/g,""))*1;
			}
			if( objX == 0){
				window.addEventListener('touchmove',function(event) {
					// event.preventDefault();
					var obj = event.target.parentNode;
					if (obj.className == "sort_list") {
						moveX = event.targetTouches[0].pageX;
						X = moveX - initX;
						if (X > 0) {
							obj.style.WebkitTransform = "translateX(" + 0 + "px)";
						}
						else if (X < 0) {
							var l = Math.abs(X);
							obj.style.WebkitTransform = "translateX(" + -l + "px)";
							if(l>160){
								l=160;
								obj.style.WebkitTransform = "translateX(" + -l + "px)";
							}
						}
					}
				});
			}
			else if(objX<0){
				window.addEventListener('touchmove',function(event) {
					// event.preventDefault();
					var obj = event.target.parentNode;
					if (obj.className == "sort_list") {
						moveX = event.targetTouches[0].pageX;
						X = moveX - initX;
						if (X > 0) {
							var r = -160 + Math.abs(X);
							obj.style.WebkitTransform = "translateX(" + r + "px)";
							if(r>0){
								r=0;
								obj.style.WebkitTransform = "translateX(" + r + "px)";
							}
						}
						else {     //向左滑动
							obj.style.WebkitTransform = "translateX(" + -120 + "px)";
						}
					}
				});
			}

		});
		window.addEventListener('touchend',function(event){
			// event.preventDefault();
			var obj = event.target.parentNode;
			if(obj.className == "sort_list"){
				objX =(obj.style.WebkitTransform.replace(/translateX\(/g,"").replace(/px\)/g,""))*1;
				if(objX>-40){
					obj.style.WebkitTransform = "translateX(" + 0 + "px)";
				}else{
					obj.style.WebkitTransform = "translateX(" + -120 + "px)";
				}
			}
		})

	});

	//删除常用出行人
	function del(id){
		var dialog = new auiDialog({});
		dialog.alert({
			title:'删除',
			msg:'确认删除？',
			buttons:['取消','确认']
		},function(ret){
			if(ret.buttonIndex == 2){
				var param  ={};
				param.url  = Config.common.delTravelers;
				param.data = {travels_id:id};
				ajax(param,function(data){
					if(data.code == 1){
						get_travelers_list('');
					}
				});
			}
		});
	}

	//常用出行人列表
	function get_travelers_list(search){
		var param={};
		param.url = Config.common.getTravelers;
		param.data = {search:search};
		ajax(param,function(data){
			if (data.code == 1) {
				$('.sort_box').empty();
				var res = data.data;
				var html = '';
				$.each(res, function (index, val) {
					var name = val.name;
					html += '<div class="sort_list"><div class="num_logo">' + name.substring(0, 1) + '</div><div class="num_name user_info gray-4">' + name + '</div><div class="user_info gray-8">' + val.card_type + '	' + val.card_number + '</div><div class="btn" onclick="del('+val.travels_id+')">删除</div></div>';
				});

				$('.sort_box').append(html);
				sort();
			}
		})
	}
	function order_details(){
		openWin('', './order_details_win.html');
	}
	function add(){
		openWin('add', './add.html');
	}
	function change(obj){
		get_travelers_list(obj.value);
	}

</script>
